<template>
  <div >
    <el-row style="padding:50px;font-size:25px;font-weight:bold">
      店铺基本信息
    </el-row>
    <el-form label-width="120px" :model="formData">
      <el-row class="inline-info" style="padding:5px"  >
        <el-col :span="8">
          <el-form-item label="店铺ID">
            <el-input v-model="formData.id" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="店铺名称">
            <el-input v-model="formData.name" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row class="inline-info" style="padding:5px"  >
        <el-col :span="8">
          <el-form-item label="分店名称">
            <el-input v-model="formData.childName" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="所属行业">
            <el-input v-model="formData.business" />
          </el-form-item>
        </el-col>
      </el-row>
    <el-row class="inline-info" style="padding:5px"  >
            <el-col :span="8">
              <el-form-item label="店主身份证号">
                <el-input v-model="formData.storesId"/>
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="店铺位置">
                <el-input v-model="formData.address" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row class="inline-info" style="padding:10px">
        <el-col :span="8">
          <el-form-item label="店铺头像">
            <div class="block">
              <el-image
                style="width: 100px; height: 100px"
                :src="images.storePhotos"
                fit="fill"></el-image>
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="主要产品图">
              <div class="block">
              <el-image
                style="width: 100px; height: 100px"
                :src="images.productDrawing"
                fit="fill"></el-image>
            </div>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row class="inline-info" style="padding:10px">
        <el-col :span="3" style="padding-left:40px">店铺实拍图</el-col>
        <el-col :span="20">
            <div class="block">
              <el-image
                style="width: 100px; height: 100px"
                :src="images.storeImage"
                fit="fill"></el-image>
            </div>
        </el-col>
      </el-row>
      <el-row class="inline-info" style="padding:10px">
        <el-col :span="3" style="padding-left:40px">营业证件照</el-col>
        <el-col :span="20">
            <div class="block">
              <el-image
                style="width: 100px; height: 100px"
                :src="images.identificationPhoto"
                fit="fill"></el-image>
            </div>
        </el-col>
      </el-row>
      <!-- <el-row>
        <el-col :span="4" :push="8">
          <el-button type="success" plain>提交</el-button>
        </el-col>
      </el-row> -->
    </el-form>
  </div>
</template>

<script>
import { getStoreById, getStoreImages } from '@/api/storeManage'
export default {
  data () {
    return {
      imageUrl: '',
      dialogImageUrl: '',
      dialogVisible: false,
      formData: {
        id: '',
        name: '',
        childName: '',
        address: '',
        storesId: '',
        business: ''
      },
      images: []
    }
  },
  methods: {
    async getStoreBase () {
      const result = await getStoreById(this.$route.params.id)
      this.formData = result[0]
    }

  },
  async created () {
    this.getStoreBase()
    const result = await getStoreImages(this.$route.params.id)
    this.images = result[0]
  }
}
</script>

<style lang="less" scoped>
img{
  width: 100%;
}
</style>
